import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

void main() {
  runApp(Myapp3());
}

/// 1.垂直列表实现
///
class Myapp1 extends StatefulWidget {
  const Myapp1({super.key});

  @override
  State<Myapp1> createState() => _Myapp1State();
}

class _Myapp1State extends State<Myapp1> {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text('Listview'),
        ),
        body: ListView(
          padding: EdgeInsets.only(top: 10),
          children: [
            ListTile(
              contentPadding: EdgeInsets.only(left: 10, top: 5, right: 5),
              leading: Image.network(
                'https://q0.itc.cn/q_70/images03/20240703/919be8c91cde419f96fdaae5d9b53038.jpeg',
              ),
              title: Text('这是保罗乔治'),
              trailing: Icon(Icons.chevron_right),
            ),
            Divider(),
            ListTile(
              leading: Icon(
                Icons.access_alarm,
                color: Colors.red,
              ),
              title: Text('这是保罗乔治2'),
              trailing: Icon(Icons.chevron_right),
            ),
            Divider(),
            ListTile(
              leading: Icon(
                Icons.access_alarm,
                color: Colors.blue,
              ),
              title: Text('这是保罗乔治2'),
              trailing: Icon(Icons.chevron_right),
            ),
            ListTile(
              leading: Image.network(
                  'https://q0.itc.cn/q_70/images03/20240703/919be8c91cde419f96fdaae5d9b53038.jpeg'),
              title: Text('这是保罗乔治3'),
              trailing: Icon(Icons.chevron_right),
            ),
            ListTile(
              leading: Image.network(
                  'https://q0.itc.cn/q_70/images03/20240703/919be8c91cde419f96fdaae5d9b53038.jpeg'),
              title: Text('这是保罗乔治4'),
              trailing: Icon(Icons.chevron_right),
            ),
            ListTile(
              leading: Image.network(
                  'https://q0.itc.cn/q_70/images03/20240703/919be8c91cde419f96fdaae5d9b53038.jpeg'),
              title: Text('这是保罗乔治5'),
              trailing: Icon(Icons.chevron_right),
            ),
            ListTile(
              leading: Image.network(
                  'https://q0.itc.cn/q_70/images03/20240703/919be8c91cde419f96fdaae5d9b53038.jpeg'),
              title: Text('这是保罗乔治6'),
              trailing: Icon(Icons.chevron_right),
            ),
            ListTile(
              leading: Image.network(
                  'https://q0.itc.cn/q_70/images03/20240703/919be8c91cde419f96fdaae5d9b53038.jpeg'),
              title: Text('这是保罗乔治7'),
              trailing: Icon(Icons.chevron_right),
            ),
          ],
        ),
      ),
    );
  }
}

/// 2.新闻列表
///

class Myapp2 extends StatefulWidget {
  const Myapp2({super.key});

  @override
  State<Myapp2> createState() => _Myapp2State();
}

class _Myapp2State extends State<Myapp2> {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        home: Scaffold(
            appBar: AppBar(
              title: Text('Listview'),
            ),
            body: ListView(
              children: [
                ListTile(
                  leading: Image.network(
                      'https://q0.itc.cn/q_70/images03/20240703/919be8c91cde419f96fdaae5d9b53038.jpeg'),
                  title: Text('这是保罗乔治7dsfjk'),
                  subtitle: Text(
                      'bdhsgfhhuiewrhfuh eouwhooirewujvfioewhufheworuifhiweljhriowjr89ew'),
                ),
                Divider(),
                ListTile(
                  trailing: Image.network(
                      'https://q0.itc.cn/q_70/images03/20240703/919be8c91cde419f96fdaae5d9b53038.jpeg'),
                  title: Text('这是保罗乔治7dsfjk'),
                  subtitle: Text(
                      'bdhsgfhhuiewrhfuh eouwhooirewujvfioewhufheworuifhiweljhriowjr89ew'),
                ),
              ],
            )));
  }
}

/// 3.水平列表实现
///

class Myapp3 extends StatefulWidget {
  const Myapp3({super.key});

  @override
  State<Myapp3> createState() => _Myapp3State();
}

class _Myapp3State extends State<Myapp3> {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
          appBar: AppBar(
            title: Text('Listview'),
          ),
          body: SizedBox(
            height: 180,
            child: ListView(
              scrollDirection: Axis.horizontal,
              children: [
                Container(
                  width: 150,
                  color: Colors.red,
                  height: 100,
                  child: Text('data'),
                ),
                Container(
                  width: 150,
                  color: Colors.green,
                  height: 100,
                ),
                Container(
                  width: 150,
                  color: Colors.blue,
                  height: 100,
                ),
                Container(
                  width: 150,
                  color: Colors.orange,
                  height: 100,
                ),
                Container(
                  width: 150,
                  color: Colors.black54,
                  height: 100,
                ),
              ],
            ),
          )),
    );
  }
}
